<template>
  <div>
    <Jdd-Card :padding="15" style="margin-bottom:16px;">
      <div style="font-size: 16px;font-weight:600;">基础表单</div>
      <div
        style="margin-top:12px;"
      >表单页用于向用户收集或验证信息，基础表单常见于数据项较少的表单场景。请参考view，无论样式、排版、交互都很全面，可以包含咱们业务对基础表单对所有需求。</div>
    </Jdd-Card>
    <div
      style="width:525px;height:300px;background-image: linear-gradient(135deg, #4561ED 0%, #162BA8 50%, #FF6539 100%);border-radius: 8px;margin:auto;margin-top:50px;color:#FFF"
    >
      <div style="font-size:28px;padding-top:50px;text-align:center;font-weight:600;">我们改版啦</div>
      <div style="font-weight: 600;text-align:center;">
        <span>Version</span>
        <span style="margin-left:28px;">upgrade</span>
      </div>
      <div
        style="font-size:12px;margin: 40px 0px;
    display: flex;
    align-items: center;
    justify-content: center;"
      >
        主题切换
        <Jdd-Icon type="ios-close" size="32" color="#FFF" />板式切换
        <Jdd-Icon type="ios-close" size="32" color="#FFF" />统一组件
        <Jdd-Icon type="ios-close" size="32" color="#FFF" />交互升级
      </div>
      <div style="text-align:center;">
        <Jdd-BtnDefault
          style="color: #FFF;background-color: transparent;
box-shadow: 2px 2px 4px 0 rgba(255,255,255,0.50);"
        >确定使用</Jdd-BtnDefault>
      </div>
    </div>

    <div class="revisionbg">
      <div class="content">
        <div>1、介绍介绍介绍介绍介绍</div>
        <div>2、介绍介绍介绍介绍介绍</div>
        <div>3、表单页用于向用户收集或验证信息，基础表单常见于数据项较少的表单场景。请参考view，无论样式、排版、交互都很全面，可以包含咱们业务对基础表单对所有需求。</div>
      </div>
    </div>
  </div>
</template>
<script>
export default {}
</script>
<style lang="less" scoped>
.revisionbg {
  margin-top: 30px;
  width: 525px;
  height: 300px;
  background-image: url('../../../resource/images/revisionbg.png');
  background-repeat: no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
  background-position: center;
  margin: auto;
}
.revisionbg .content {
  width: 180px;
  height: 110px;
  overflow-y: auto;
  font-size: 12px;
  color: #2237ad;
}
</style>
